"use client";

import useMeStore from "@/client/store/me";
import { Skeleton } from "../ui/skeleton";

export default function ForAuth({ children, when }: { children: React.ReactNode; when: "authed" | "unauthed" }) {
  const { auth, loading } = useMeStore((state) => state);

  if (loading) {
    return <Skeleton className="h-4 rounded-none w-[24px]" />
  }

  if (auth.authed) {
    return when == "authed" ? <>{children}</> : null;
  } else {
    return when == "unauthed" ? <>{children}</> : null;
  }
}
